<template>
	<view>
	
			<tm-picker
						:mapKey="'name'"
						:defaultValue="pickydata"
						@confirm="onConfirm"
						@close="onCancel"
						:show="showPop"
						:columns="columns"
						v-model="pickydata"
						v-model:model-str="dateStr"
						:beforeChange="onChange"
						color="#2DB295"
					>
			</tm-picker>
	</view>
</template>

<script lang="ts" setup>
import { ref,defineEmits  } from 'vue';
import {area} from '@/utils/api'
const props = defineProps({
	showPop: {
		type: Boolean,
		default: false
	}
})
const dateStr = ref()
const columns = ref([])
const data = ref({})
const pickydata = ref([0,0,0])
//获取省市区
const provinceList=async() =>{
	const res = await area();
	let data = res.data;
	columns.value = data;
	
	// this.cityList();
	let obj1 = {
		province:columns.value[0].id
	}
	const res1 = await area(obj1);
	let data1 = res1.data;
	columns.value[0].children = data1
	// columns.value.forEach(item=>{
	// 	item.children=data1
	// 	item.children[0].children=[]
	// })
	let obj2 = {
		province:columns.value[0].id,
		city:columns.value[0].children[0].id,
	}
	const res2 = await area(obj2);
	let data2 = res2.data;
	columns.value[0].children[0].children =data2
	console.log(columns.value, 'columns')
}
provinceList()
//取消弹窗
const onCancel=async() =>{
	emit('cancel')
}
//改变
const one_index = ref(0)
const two_index = ref(0)
const onChange=async(e,b,c)=> {
	console.log(e,b,c, 'eee222');
	data.value= e
	if(e.to.levelIndex==0){
		pickydata.value[0] = e.to.itemindex
		pickydata.value[1] = 0
		pickydata.value[2] = 0
		
		let obj = {
			province:e.to.data.id
		}
		const res = await area(obj);
		let data = res.data;
		columns.value[e.to.itemindex].children = data
		// columns.value.forEach(item=>{
		// 	item.children = data
		// 	item.children[0].children = []
		// })
		let obj1 = {
			province:e.to.data.id,
			city:data[0].id,
		}
		const res1 = await area(obj1);
		// columns.value[e.to.itemindex].children.forEach(item=>{
		// 	item.children = res1.data
		// })
		columns.value[e.to.itemindex].children[0].children = res1.data
		console.log(columns.value)
		one_index.value = e.to.itemindex
		
	}else if(e.to.levelIndex==1){
		two_index.value = e.to.itemindex
		pickydata.value[1] = e.to.itemindex
		pickydata.value[2] = 0
		let obj1 = {
			province:columns.value[one_index.value].id,
			city:e.to.data.id,
		}
		const res1 = await area(obj1);
		let data1 = res1.data;
		columns.value[one_index.value].children[two_index.value].children = data1
		// columns.value[one_index.value].children.forEach(item=>{
		// 	item.children = data1
		// })
		console.log(pickydata.value,99888)
	}
		return pickydata.value
}
//确认选择
const emit = defineEmits(['confirm','cancel'])
const onConfirm=()=> {
	let dateStrx = columns.value[pickydata.value[0]].name+'/'+columns.value[pickydata.value[0]].children[pickydata.value[1]].name+'/'+columns.value[pickydata.value[0]].children[pickydata.value[1]].children[pickydata.value[2]].name
	let pickydatax =[columns.value[pickydata.value[0]].id,columns.value[pickydata.value[0]].children[pickydata.value[1]].id,columns.value[pickydata.value[0]].children[pickydata.value[1]].children[pickydata.value[2]].id] 
	emit('confirm', dateStrx);
	emit('confirm_shop', dateStrx,pickydatax);
	onCancel();
}
</script>
<style>
	
</style>